<template>
	<layout>
		<!-- #ifdef MP-WEIXIN -->
		<uv-navbar
		  :fixed="false"
		  :title="title"
		  left-arrow
		  @leftClick="$onClickLeft"
		/>
		<!-- #endif -->
		<view style="background-color: #ffffff; padding: 0rpx 30rpx 30rpx 30rpx;">
			<uv-form labelPosition="top" :model="model1" :rules="rules" ref="uForm" labelWidth="270" :errorType="errorType" >
				<uv-form-item label="第一步:微信扫描下面公众号关注" prop="oldPassword" borderBottom required>
					<uv-image :src="qrCodeUrl" :lazy-load="true"></uv-image>
				</uv-form-item>
				<uv-form-item label="第二步:" prop="newPassword" borderBottom required>
					关注公众号后,公众号会自动回复本人openid，且复制openid并绑定
				</uv-form-item>
				<uv-form-item label="绑定openid:" prop="confirmPassword" borderBottom required>
					<uv-input v-model="openid" type="input"  border="none">
					</uv-input>
				</uv-form-item>
				<uv-button  text="保存" v-if="member.openid == ''" customStyle="margin-top: 10px" color="#09b4f1" @click="onSubmit"></uv-button>
				<uv-button  text="已经绑定" v-else customStyle="margin-top: 10px" color="#09b4f1" ></uv-button>
			</uv-form>
		</view>
	</layout>
</template>

<script setup>
import {
  ref
} from 'vue'
import { onLoad,onShow} from '@dcloudio/uni-app'
import { useMainStore } from '@/store/store'
import { storeToRefs } from 'pinia'
import {
  updateOpenid,
  getWechatInfo
} from '@/api/user'
const title = ref('绑定公众号')
const errorType = ref('message')
const openid = ref('')
const qrCodeUrl = ref('')
const main = useMainStore()
const { member } = storeToRefs(main)



onLoad((option) => {
	getInfo()
})	


const onSubmit = async() => {
	if(openid.value == ''){
		uni.showToast({
			icon: 'error',
			title: '请填写openid'
		})
		return
	}
	let data = await updateOpenid({openid:openid.value})
	if (data) {
		uni.showToast({
			title: "绑定成功",
			icon: 'success',
			duration: 2000
		})
	
		uni.navigateBack()
		
	}
}

const getInfo = async() => {
	let data = await getWechatInfo()
	qrCodeUrl.value = data.qrCodeUrl

}

const gopage = (url) => {
	uni.navigateTo({
		url
	})
}

</script>

<style lang="scss" scoped>
	
</style>
